<template>
    <div class="header">
        <div class="header-title">
            <span class="header-name"> <span>Home</span> 项目管理中心首页</span>
            <span class="header-tips">深交所中小企业之家项目管理系统</span>
        </div>
        <div class="user">
            <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3245994356,1314206822&fm=26&gp=0.jpg" alt="">
        </div>
    </div>
</template>

<script>
    export default {
        name: 'homeHeader'
    }
</script>

<style scoped lang="less" >
    .header {
        height: 130px;
        display: flex;
        padding: 0 50px 0 44px;
        justify-content: space-between;

        .header-title {
            display: flex;
            flex-direction: column;
            justify-content: center;

            .header-name {
                font-weight: bold;
                color: #000;
                font-size: 18px;

                >span {
                    font-size: 30px;
                }
            }

            .header-tips {
                color: #333;
                font-size: 14px;
                margin-top: 10px;
            }

        }

        .user {
            display: flex;
            align-items: center;

            img {
                width: 30px;
                height: 30px;
                border-radius: 15px;
                overflow: hidden;
            }

        }

    }
</style>
